<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html class="no-js" lang="ZXX">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>Vistar - Clean, Minimal eCommerce HTML5 Template </title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="manifest" href="site.webmanifest">
		<link rel="shortcut icon" type="image/x-icon" href="assets/img/favicon.ico">
        <!-- Place favicon.ico in the root directory -->

		<!-- CSS here -->
        <link rel="stylesheet" href="assets/css/bootstrap.min.css">
        <link rel="stylesheet" href="assets/css/owl.carousel.min.css">
        <link rel="stylesheet" href="assets/css/animate.min.css">
        <link rel="stylesheet" href="assets/css/magnific-popup.css">
        <link rel="stylesheet" href="assets/css/fontawesome-all.min.css">
        <link rel="stylesheet" href="assets/css/themify-icons.css">
        <link rel="stylesheet" href="assets/css/dripicons.css">
        <link rel="stylesheet" href="assets/css/meanmenu.css">
        <link rel="stylesheet" href="assets/css/slick.css">
        <link rel="stylesheet" href="assets/css/main.css">
        <link rel="stylesheet" href="assets/css/responsive.css">
    </head>
    <body>


       <!-- header-start -->
	<header>

		<div id="sticky-header" class="main-menu-area pl-55 pr-55">
			<div class="container-fluid">
				<div class="row">
					<div class="col-xl-3 col-lg-2 d-flex align-items-center">
						<div class="logo">
							<a href="Main.jsp"><img src="assets/img/logo/logo.png"
								alt="" /></a>
						</div>
					</div>
					<div class="col-xl-6 col-lg-7">
						<div class="header-search f-right d-none d-xl-block">
							<form class="header-search-form">
								<input placeholder="Search" type="text">
								<button type="submit">
									<i class="dripicons-search"></i>
								</button>
							</form>
						</div>
						<div class="main-menu text-center">
							<nav id="mobile-menu">
								<ul>
									<li class="active"><a href="#">手机品牌</a>
										<ul class="sub-menu text-left">
											<li><a
												href="http://localhost:8080/phone-introduce/Huawei-display.jsp">华为</a></li>
											<li><a href="index-2.html">小米</a></li>
											<li><a href="index-3.html">苹果</a></li>
											<li><a href="index-4.html">OPPO</a></li>
											<li><a href="index-5.html">VIVO</a></li>
											<li><a href="index-6.html">魅族</a></li>
											<li><a href="index-6.html">一加</a></li>
											<li><a href="index-6.html">锤子</a></li>
											<li><a href="index-6.html">中兴</a></li>
											<li><a href="#">...</a></li>
										</ul></li>
									<li><a href="http://localhost:8080/phone-introduce/manage?method=showActivityUsersList">活动情况</a>
								</ul>
							</nav>
						</div>
					</div>
					
				</div>
			</div>
		</div>
		<div class="extra-info">
			<div class="close-icon">
				<button>
					<i class="far fa-window-close"></i>
				</button>
			</div>
			<div class="logo-side mb-30">
				<a href="Main.jsp"> <img src="assets/img/logo/white.png"
					alt="" />
				</a>
			</div>
			<div class="side-info mb-30">
				<div class="contact-list mb-30">
					<h4>Office Address</h4>
					<p>123/A, Miranda City Likaoli Prikano, Dope</p>
				</div>
				<div class="contact-list mb-30">
					<h4>Phone Number</h4>
					<p>+0989 7876 9865 9</p>
					<p>+(090) 8765 86543 85</p>
				</div>
				<div class="contact-list mb-30">
					<h4>Email Address</h4>
					<p>
						<a href="/cdn-cgi/l/email-protection" class="__cf_email__"
							data-cfemail="1d74737b725d78657c706d7178337e7270">[email&#160;protected]</a>
					</p>
					<p>
						<a href="/cdn-cgi/l/email-protection" class="__cf_email__"
							data-cfemail="37524f565a475b52195a565e5b775f425a1954585a">[email&#160;protected]</a>
					</p>
				</div>
			</div>
			<div class="instagram">
				<a href="#"> <img src="assets/img/portfolio/p1.jpg" alt="">
				</a> <a href="#"> <img src="assets/img/portfolio/p2.jpg" alt="">
				</a> <a href="#"> <img src="assets/img/portfolio/p3.jpg" alt="">
				</a> <a href="#"> <img src="assets/img/portfolio/p4.jpg" alt="">
				</a> <a href="#"> <img src="assets/img/portfolio/p5.jpg" alt="">
				</a> <a href="#"> <img src="assets/img/portfolio/p6.jpg" alt="">
				</a>
			</div>
			<div class="social-icon-right mt-20">
				<a href="#"> <i class="fab fa-facebook-f"></i>
				</a> <a href="#"> <i class="fab fa-twitter"></i>
				</a> <a href="#"> <i class="fab fa-google-plus-g"></i>
				</a> <a href="#"> <i class="fab fa-instagram"></i>
				</a>
			</div>
		</div>
	</header>
       <!-- header-end -->

        <main>

            <!-- breadcrumb-area-start -->
            <div class="breadcrumb-area grey-bg pt-155 pb-155">
                <div class="container">
                    <div class="row">
                        <div class="col-xl-12">
                            <div class="breadcrumb-text text-center">
                                <h1>华为P20
								</h1>
                                <ul class="breadcrumb-menu">
                                    <li><a href="index.html">华为手机序列</a>/</li>
                                    <li><span>华为P20</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- breadcrumb-area-start -->


            <!-- shop-banner-area start -->
            <section class="shop-banner-area pt-120 pb-90">
                <div class="container">
                    <div class="row">
                        <div class="col-xl-7">
                            <div class="shop-thumb-tab mb-30">
                                <ul class="nav" id="myTab2" role="tablist">
                                    <li class="nav-item">
                                        <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab"
                                            aria-selected="true"><img src="assets/img/机型介绍图/P20-12.jpg" alt=""> </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab"
                                            aria-selected="false"><img src="assets/img/机型介绍图/P20_11.jpg" alt=""></a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" id="profile-tab2" data-toggle="tab" href="#profile1" role="tab"
                                            aria-selected="false"><img src="assets/img/机型介绍图/P20_13.jpg" alt=""></a>
                                    </li>
                                </ul>
                            </div>
                            <div class="product-details-img mb-30">
                                <div class="tab-content" id="myTabContent2">
                                    <div class="tab-pane fade show active" id="home" role="tabpanel">
                                        <div class="product-large-img">
											<img src="assets/img/机型介绍图/P20-12.jpg" alt="">
                                        </div>
                                    </div>
                                    <div class="tab-pane fade" id="profile" role="tabpanel" >
                                        <div class="product-large-img">
                                            <img src="assets/img/机型介绍图/P20_11.jpg" alt="">
                                        </div>
                                    </div>
                                    <div class="tab-pane fade" id="profile1" role="tabpanel" >
                                        <div class="product-large-img">
                                            <img src="assets/img/机型介绍图/P20_13.jpg" alt="">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-5">
                            <div class="product-details mb-30">
                                <div class="product-details-title">
                                    <p>华为（HUAWEI）</p>
                                    <h1>华为&nbsp;p20</h1>
                                    <div class="price details-price pb-30 mb-20">
                                        <span>￥${phonePrice}</span>
                                    </div>
                                </div>
                                <p>华为P20 是华为公司旗下一款智能手机，搭载麒麟970处理器+6GB内存，采用5.8英寸显示屏，
								分辨率2240x1080，后置徕卡双摄镜头，通过AI技术实现场景识别模式适配。
								华为P20新推出的极光色采用了创新的渐变配色方，
								通过先进的纳米真空光学镀膜技术，在机身背面创造出迷人的渐变色“极光带”。</p>
                                <div class="product-cat mt-30 mb-30">
									<span> 机身颜色： </span>
									<a href="#">宝石蓝</a>
									<a href="#">樱粉金</a>
									<a href="#">亮黑色</a>
									<a href="#">极光色</a>
									
                                </div>
                                <div class="product-social mb-45">
                                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                                    <a href="#"><i class="fab fa-twitter"></i></a>
                                    <a href="#"><i class="fab fa-behance"></i></a>
                                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                                    <a href="#"><i class="fab fa-youtube"></i></a>
                                </div>
                                <div class="product-details-action">
                                    <form action="#">
                                        <div class="plus-minus">
                                            
                                        </div>
                                        
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- shop-banner-area end -->
            <!-- product-desc-area start -->
            <section class="product-desc-area pb-90">
                <div class="container">
                    <div class="row">
                        <div class="col-12">
                            <div class="bakix-details-tab">
                                <ul class="nav text-center justify-content-center pb-30 mb-50" id="myTab" role="tablist">
                                    <li class="nav-item">
                                        <a class="nav-link active" id="desc-tab" data-toggle="tab" href="#id-desc" role="tab"
                                            aria-controls="home" aria-selected="true">测评文章 </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" id="id-add-in" data-toggle="tab" href="#id-add" role="tab"
                                            aria-controls="profile" aria-selected="false">手机参数</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" id="id-r" data-toggle="tab" href="#id-rev" role="tab"
                                            aria-controls="profile" aria-selected="false">评论区</a>
                                    </li>
                                </ul>
                            </div>
                            <div class="tab-content" id="myTabContent">
                                <div class="tab-pane fade show active" id="id-desc" role="tabpanel" aria-labelledby="desc-tab">
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="event-text">
                                                <p>在外观上，华为P20与之前曝光的消息基本相同，正面采用了新一代的全面屏设计，5.8英寸的屏幕，
												屏占比更高，显示效果更出色。顶部的刘海儿比iPhone X小很多，其中有前置摄像头，听筒和传感器等
												设备。下方则是正面的指纹按键，在使用方式上更适合大家原来的使用习惯，并且省去了虚拟按键，可以
												留出更大的显示空间。</p>
												<p>如果你准备购买华为P20的话，可以点击这里前往天猫商城查看了解。</p>
												<p>相机方面，依旧是与徕卡合作的摄像头，华为P20后置双摄像头，1200万像素+2000万像素摄像头，
												拥有f/1.8+f/1.6的大光圈，并且有1.55μm的像素尺寸，摄像头配置非常给力。P20 Pro采用后置三摄像头，
												加入了一枚4000万像素的主摄像头，而且能够支持三倍变焦，5倍的混合变焦以及10倍的数码变焦，可以达到
												102400的感光度，堪比专业单反，简直变态。前置2400万像素摄像头，不仅拍得清晰，而且可以实现背景虚化。</p>

												<p>另外，华为P20系列还支持960帧的慢动作拍摄，可以拍摄0.2~0.3s的时间。同时，AI拍照依然是华为P20的
												特色之一，能够识别不同的场景进行专门的参数调教。支持光学防抖和电子防抖混合的AI智能防抖，在手持
												情况下也可以支持6秒钟以上的长曝光。DxOMark给华为P20的评分总分102分，其中拍照101分，摄像97分；
												而P20 Pro更加残暴，总分109分，比原本排在首位的三星S9+整整高了10分，拍照能力几乎是手机中最强的。<br>
												<div align="center">
													<a href="#">
													    <img src="assets/img/推文图/P20_1.jpg" alt="">
													</a>
												</div>
												
												</p>
                                                <p>
													 北京时间3月27日21:00，华为在法国巴黎大皇宫举行了春季新品发布会，正式推出了新一代旗舰手机——华为P20
													 和华为P20 Pro，采用新一代异形全面屏设计，拥有全新的惊艳配色，机身背部为曲面玻璃材质。相机方面，
													 华为P20配备后置黑白+彩色双摄，P20 Pro为全球首款后置三摄的手机，主镜头像素高达4000万。华为P20
													 定价649欧元，华为P20 Pro定价899欧元。
												</p>
												
												<div align="center">
													<a href="#">
													    <img src="assets/img/推文图/P20_2.jpg" alt="">
													</a>
												</div>
												<p>
													华为P20系列采用全新的渐变色机身，根据华为官方的说法，其设计灵感来自于我们赖以生存的大自然，应该是寓意
													着五彩缤纷的世界，这一新设计令整机增色太多，十分惊艳。华为P20系列共提供四款配色给大家选择。显示方面，
													华为P20系列采用了新一代异形全面屏，其中，华为P20采用5.8英寸显示屏，最高亮度可达770nit，比iPhone X高
													出了23%；华为P20 Pro采用6.1英寸OLED显示屏，对比度高达1:1000000，色域高达105%。
												</p>
												<div align="center">
													<a href="#">
													    <img src="assets/img/推文图/P20_3.jpg" alt="">
													</a>
												</div>
												
												<p>	
													华为P20配备正面指纹识别模块，位于正面板下方，指纹模块十分修长，看上去灵气逼人，并且正面指纹相较于背面
													指纹和面部识别，在易用性和人性化上要更加出色。华为P20系列的屏幕“刘海”要比iPhone X小上许多，两侧可以显
													示更多内容，视觉效果更加出色。华为P20内置3400mAh大电池，华为P20 Pro更提供4000mAh超大容量电池，续航相
													较同价位竞品要好上许多。另外，华为P20 Pro还支持IP67高级别防尘防水特性，日常使用更加安心。
												</p>
												<div align="center">
													<a href="#">
													    <img src="assets/img/推文图/P20_4.jpg" alt="">
													</a>
												</div>
													相机方面，华为P20系列得益于人工智能技术加持，相机可玩性更高，拍出的照片质量更加上乘。华为P20后置1200万
													像素彩色镜头和2000万像素黑白镜头，光圈分别为F1.8和F1.6，单位像素面积大至1.55μm，进光量更大，按华为官方
													的说法，华为P20即便在暗光环境下，拍照效果依旧出色。此外，华为P20支持专业人像模式，可以拍出很好的背景虚化
													照片。专业相机评测机构DXOMark为华为P20的相机打出了102分的综合得分，其中拍照得分107分，视频录制得分94分
													，可谓名列前茅。华为P20 Pro后置三枚摄像头，像素分别达到4000万、2000万和800万，并且拥有更大的感光面积，
													感光度最高可达102400，远超苹果iPhone X，即便在极弱光环境下也能拍出清晰的照片。并且，在逆光环境下，
													华为P20 Pro也能拍出震撼的效果。华为P20 Pro支持3倍光学变焦，5倍无损变焦，堪称目前世界上最强悍的变焦能力，
													同时，华为P20 Pro拥有四位一体的对焦系统，快门速度惊人，可抓拍到更清晰的动态场景。在息屏状态下，华为P20 Pro
													可以实现0.3s极速快拍。此外，华为P20 Pro还内置专业的色温传感器，在拍摄食物等照片时画面细节和色彩更加出色。
												</p>
												<div align="center">
													<a href="#">
													    <img src="assets/img/推文图/P20_5.jpg" alt="">
													</a>
												</div>
												<p>
													得益于人工智能技术，华为P20 Pro的相机可以智能识别超过500个场景，覆盖19大类。华为P20 Pro不仅支持EIS、OIS防抖，
													还支持基于人工智能技术的HUAWEI AIS防抖，体验更加出色。凭借HUAWEI AIS防抖技术，华为P20 Pro在拍摄视频时可以无惧抖动，
													效果更加稳定。专业相机评测机构DXOMark为华为P20 Pro的相机打出了109分的综合得分，是迄今为止得分最高的智能手机。
												</p>
												<div align="center">
													<a href="#">
													    <img src="assets/img/推文图/P20_6.jpg" alt="">
													</a>
												</div>
												<p>
													硬件配置方面，华为P20系列搭载麒麟970人工智能移动计算平台，基于台积电10纳米制程工艺打造，内置独立NPU（神经网络单元）。
													华为P20系列支持HUAWEI SuperCharge高速快充技术，30分钟可充58%的电，比iPhone X的充电速度快了三倍。
												</p>
												<div align="center">
													<a href="#">
													    <img src="assets/img/推文图/P20_7.jpg" alt="">
													</a>
												</div>
												<p>
													华为目前正在联合谷歌、微软、亚马逊等科技企业，共建一个良好的AI生态系统。华为P20系列出厂将预装基于安卓8.1深度定制的
													EMUI 8.1系统，华为P20系列支持谷歌的ARCore特性，这也让华为成为了第一批支持ARCore特性的国产手机厂商，这一特性让华为
													P20系列拥有绝佳的增强现实体验。
												</p>	
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="tab-pane fade" id="id-add" role="tabpanel" aria-labelledby="id-add-in">
                                    <div class="additional-info">
                                        <div class="table-responsive">
                                            <h4>具体参数</h4>
                                            <table class="table">
                                                <tbody>
                                                    <tr>
                                                        <th>CPU型号</th>
                                                        <td class="product_weight">海思&nbsp;Kirin 970</td>
                                                		<th>前置像素</th>
                                                		<td>2400万像素</td>
                                                		<th>后置像素</th>
                                                		<td>2000万像素+1200万像素</td>
                                                		
                                                							
                                                    </tr>
                                                    <tr>
                                                        <th>运行内存</th>
                                                        <td class="product_dimensions">6GB</td>
                                                		<th>ROM</th>
                                                		<td>64/128GB</td>
                                                		<th>屏幕</th>
                                                		<td>5.8英寸 2244x1080像素</td>
                                                    </tr>
                                                    <tr>
                                                        <th>网络</th>
                                                        <td class="product_dimensions">2G/3G/4G</td>
                                                		<th>电池</th>
                                                		<td>3400mAh</td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <div class="tab-pane fade" id="id-rev" role="tabpanel" aria-labelledby="id-r">
                                    <div class="additional-info">
                                        <div class="event-text mb-40">
                                            <ul>
                                            	<c:forEach items="${commentList}" var="comment">
                                            		<li>${comment.getUser_name()}:${comment.getUser_comment_content()}</li>
                                            		<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="80%" color=#987cb9 SIZE=3>
                                            	</c:forEach>
                                            	<a href="#" style="text-decoration:underline;">更多评论</a>
                                            </ul>
                                            <br>
											<form action="phone" method="post">
                                           				<input type="hidden" name="method" value="submitP20Comment" />
                                           				<textarea name="comment" cols="40" rows="8" ></textarea>
                                           				<input type="submit" value="提交评论" />
                                           	</form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- product-desc-area end -->
    
        </main> 
        <!-- footer-start -->
        <footer>
            <div class="footer-area pt-100 pb-60 grey-bg pl-55 pr-55">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-xl-3 col-lg-3 col-md-6">
                            <div class="footer-wrapper mb-30">
                                <div class="footer-logo">
                                    <a href="Main.jsp"><img src="assets/img/logo/logo.png" alt=""></a>
                                </div>
                                <div class="footer-text pr-50">
                                  
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-2 col-lg-2 col-md-6">
                            <div class="footer-wrapper ml-20 mb-30">
                                <h4 class="footer-title">Quick Link</h4>
                                <ul class="footer-menu footer-2-menu">
                                    <li><a href="#">About us</a></li>
                                    <li><a href="#">term</a></li>
                                    <li><a href="#">policy</a></li>
                                    <li><a href="#">service</a></li>
                                    <li><a href="#">My Account</a></li>
                                    <li><a href="#">Checkout</a></li>
                                    <li><a href="#">Order tracking</a></li>
                                    <li><a href="#">Help & Support</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-xl-2 col-lg-2 col-md-3">
                            <div class="footer-wrapper ml-70 mb-30">
                                <h4 class="footer-title">Contact Us</h4>
                                <ul class="footer-link">
                                    <li>Sagrada Familia, Herba <br>
                                        Street Front USA</li>
                                    <li><a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f59491989c9bb5908d9498859990db969a98">[email&#160;protected]</a></li>
                                    <li>002- 01008431112</li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-xl-2 col-lg-2 col-md-3">
                            <div class="footer-wrapper mb-30 ml-70">
                                <h4 class="footer-title">Follow Us</h4>
                                <ul class="footer-menu">
                                    <li><a href="#">Facebook/Vistar</a></li>
                                    <li><a href="#">Twitter/Vistar</a></li>
                                    <li><a href="#">Linkdin/Vistar</a></li>
                                    <li><a href="#">Skype_Vistar</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-xl-3 col-lg-3 col-md-5">
                            <div class="footer-wrapper mb-30">
                                <h4 class="footer-title">Sign up to Newsletter</h4>
                                <div class="footer-nfo">
                                    <p>But I must explain to you how all this mistak. </p>
                                </div>
                                <div class="newsletters-form">
                                    <form action="#">
                                        <input placeholder="Enter Your Email :" type="email">
                                        <button type="submit">subscribe</button>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="footer-bottom-area footer-2-bottom pt-25 pb-25 grey-bg pr-55 pl-55">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-xl-8 col-lg-8 col-md-8">
                            <div class="copyright">
                                <p> Copyright <i class="far fa-copyright"></i> 2018 <a href="#">BDevs.</a> All Rights Reserved</p>
                            </div>
                        </div>
                        <div class="col-xl-4 col-lg-4 col-md-4">
                            <div class="footer-bottom-img text-center text-lg-right">
                                <img src="assets/img/footer/01.png" alt="">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </footer>
        <!-- footer-end -->




		<!-- JS here -->
        
		<script src="assets/js/vendor/modernizr-3.5.0.min.js"></script>
        <script src="assets/js/vendor/jquery-1.12.4.min.js"></script>
        <script src="assets/js/popper.min.js"></script>
        <script src="assets/js/bootstrap.min.js"></script>
        <script src="assets/js/owl.carousel.min.js"></script>
        <script src="assets/js/isotope.pkgd.min.js"></script>
        <script src="assets/js/jquery.countdown.min.js"></script>
        <script src="assets/js/slick.min.js"></script>
        <script src="assets/js/jquery.meanmenu.min.js"></script>
        <script src="assets/js/ajax-form.js"></script>
        <script src="assets/js/wow.min.js"></script>
        <script src="assets/js/jquery.scrollUp.min.js"></script>
        <script src="assets/js/imagesloaded.pkgd.min.js"></script>
        <script src="assets/js/jquery.magnific-popup.min.js"></script>
        <script src="assets/js/plugins.js"></script>
        <script src="assets/js/main.js"></script>
    </body>
</html>